Tabs.changeCurrent   A
last analyzed

Complexity

Conditions 3

Size

Total Lines 14
Code Lines 11

Duplication

Lines 0
Ratio 0 %

Importance

Changes 0
Metric Value
eloc 11
dl 0
loc 14
rs 9.85
c 0
b 0
f 0
cc 3
1
"use strict";
2
Object.defineProperty(exports, "__esModule", { value: true });
3
const globals_1 = require("../globals/globals");
4
(function (root, factory) {
5
    if (typeof globals_1.define === 'function' && globals_1.define.amd) {
6
        globals_1.define([], factory);
7
    }
8
    else if (typeof module === 'object' && module.exports) {
9
        module.exports = factory();
10
    }
11
    else {
12
        root.Tabs = factory();
13
    }
14
}(typeof self !== 'undefined' ? self : this, function () {
0 ignored issues
show
Bug introduced by
The variable self seems to be never declared. If this is a global, consider adding a /** global: self */ comment.

This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.

To learn more about declaring variables in Javascript, see the MDN.

Loading history...
15
    class Tabs {
16
        constructor(options) {
17
            this.options = options || {};
18
            this.options.tabTogglers = (Object.keys(this.options).length && options.tabTogglers) ? (typeof options.tabTogglers === 'string' ? document.querySelectorAll(options.tabTogglers) : options.tabTogglers) : document.querySelectorAll('.tabs [data-pane]');
19
            this.onInit();
20
            this.onLoad();
21
        }
22
        static clearClasses(arr) {
23
            arr.forEach(function (el) {
24
                el.classList.remove('active');
25
            });
26
        }
27
        onLoad() {
28
            if (this.options && this.options.onLoad) {
29
                this.options.onLoad();
30
            }
31
        }
32
        onInit() {
33
            this.setCurrentOnInit();
34
            this.initClasses();
35
            this.changeCurrent();
36
        }
37
        setCurrentOnInit() {
38
            let currentTabToggler = (this.options.tabTogglers)[0];
39
            let currentPane;
40
            if (this.options.tabTogglers[0] instanceof HTMLElement) {
0 ignored issues
show
Bug introduced by
The variable HTMLElement seems to be never declared. If this is a global, consider adding a /** global: HTMLElement */ comment.

This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.

To learn more about declaring variables in Javascript, see the MDN.

Loading history...
41
                currentPane = document.getElementById(currentTabToggler.dataset.pane);
42
            }
43
            currentTabToggler.classList.add('active');
44
            currentPane.classList.add('active');
0 ignored issues
show
Bug introduced by
The variable currentPane does not seem to be initialized in case this.options.tabTogglers.0 instanceof HTMLElement on line 40 is false. Are you sure this can never be the case?
Loading history...
45
        }
46
        initClasses() {
47
            this.options.tabTogglers.forEach(function (tabToggler) {
48
                let matchedPane = document.getElementById(tabToggler.dataset.pane);
49
                matchedPane.classList.add('tab-pane');
50
            });
51
        }
52
        changeCurrent() {
53
            let that = this;
54
            that.options.tabTogglers.forEach(function (tabToggler) {
55
                tabToggler.addEventListener('click', function (e) {
56
                    e.preventDefault();
57
                    let parentEl = this.closest('.tabs').parentElement;
58
                    Tabs.clearClasses(that.options.tabTogglers);
59
                    Tabs.clearClasses(parentEl.querySelectorAll('.tab-pane'));
60
                    this.classList.add('active');
61
                    let matchedPane = parentEl.querySelector('#' + this.dataset.pane);
62
                    matchedPane.classList.add('active');
63
                });
64
            });
65
        }
66
    }
67
    return Tabs;
68
}));
69